/*------------------------ 函数生成 class ---------------*/
// 文本对齐  ta-left
@each $align in left, right, center {
  .ta-#{$align} {
      text-align: #{$align};
  }
}

// 字号
@for $size from 12 through 40 {
  .font-#{$size} {
      font-size:  #{$size}px !important;
  }
}

// 字重
$weight:1000;
@while $weight >= 0 {
  .weight-#{$weight} {
      font-weight:  #{$weight} !important;
  }
  $weight: $weight - 100;
}
.weight-bold {
    font-weight: bold;
}

/* margin padding 100px以下 class 用法： mt-10*/
// 对于from ... through，范围包括<start>和<end>的值，
// 但是from ... to，范围运行到但不包括<end>的值。
@for $i from 0 through 100 {
  .m-#{$i} {
      margin: #{$i}px !important;
  }
  .mt-#{$i} {
      margin-top: #{$i}px !important;
  }
  .ml-#{$i} {
      margin-left: #{$i}px !important;
  }
  .mr-#{$i} {
      margin-right: #{$i}px !important;
  }
  .mb-#{$i} {
      margin-bottom: #{$i}px !important;
  }
  .p-#{$i} {
      padding: #{$i}px !important;
  }
  .pt-#{$i} {
      padding-top: #{$i}px !important;
  }
  .pl-#{$i} {
      padding-left: #{$i}px !important;
  }
  .pr-#{$i} {
      padding-right: #{$i}px !important;
  }
  .pb-#{$i} {
      padding-bottom: #{$i}px !important;
  }
  .w-#{$i} {
      width: #{$i}px !important;
  }
  .h-#{$i} {
      height: #{$i}px !important;
  }
}